<script setup lang="ts">
import { ref, Ref, computed } from 'vue';
import { useRouter } from 'vue-router';
import { setPassword } from '../../api/user'
import { showToast } from 'vant';
const router = useRouter()

const password: Ref<string> = ref('')
const psw: Ref<string> = ref('')

const flag = computed(() => {
  return psw.value != password.value || psw.value.length == 0
})

function onSubmit() {
  // this.$router.push()
  // router.push('/login')
  setPassword({
    tel: localStorage.getItem('tel' || ''),
    password: password.value
  }).then(res => {
    // console.log(res);
    if (res.data.code == 200) {
      showToast({
        message: '恭喜你注册成功'
      })
      localStorage.removeItem('tel')
      router.push('/login')
    } else {
      showToast({
        message: res.data.message
      })
    }
  })
}
</script>
<template>
  <div class="box">

    <van-nav-bar class="header" title="设置密码" left-text="返回" left-arrow @click-left="$router.back()" />

    <div class="content">
      <van-form @submit="onSubmit">
        <van-cell-group inset>
          <van-field v-model="psw" label="密码" placeholder="请输入密码"> </van-field>
          <van-field v-model="password" label="确认密码" placeholder="请再次输入密码"> </van-field>
        </van-cell-group>
        <div style="margin: 16px;">
          <van-button :disabled="flag" round block type="danger" native-type="submit">
            提交
          </van-button>
        </div>

      </van-form>
    </div>
  </div>
</template>
<style scoped lang="scss">
.header {
  margin-bottom: 30px;
  background-color: #f1f8e9;
}
</style>
